-
Notifications
You must be signed in to change notification settings - Fork 130
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix web components as openers/closers not working properly #713
Conversation
}, | ||
} | ||
|
||
cy.spy(handlers, 'show').as('show') | ||
cy.spy(handlers, 'hide').as('hide') | ||
cy.window().its('instance').invoke('on', 'show', handlers.show) | ||
cy.window().its('instance').invoke('on', 'hide', handlers.hide) | ||
cy.get('my-dialog').shadow().find('fancy-button').first().click() |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The tests were passing because .click()
was clicking the exact shadow root. A .realClick()
however would click the inner <slot>
and cause the test to fail, as reported in #712.
) { | ||
this.hide(event) | ||
} | ||
const opener = closest(`[${SCOPE}-show="${this.id}"]`, target) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The code was massaged a bit to be easier to read but the fix is the use of closest(..)
.
// we use our custom `closest(..)` function so that it can cross shadow | ||
// boundaries | ||
// See: https://github.com/KittyGiraudel/a11y-dialog/issues/712 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is the actual fix explanation.
Fixes #712.